import { Modal, Button, Card } from 'antd';
import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { formatMessage } from 'umi/locale';

/**
 * 关键字 <= 数据
 */
const mapStateToProps = models => {
  const model = models.lvchanglong;
  return {
    formRecord: model.formRecord,
    result: model.result,
    modalShow: model.modalShow,
  };
};

/**
 * 关键字 <= 方法
 */
const mapDispatchToProps = dispatch => ({
  hideModal: () => {
    dispatch({ type: `lvchanglong/save`, payload: { modalShow: false } });
  },
});

@connect(
  mapStateToProps,
  mapDispatchToProps
)
class ModalDemo extends PureComponent {
  render() {
    const { formRecord, result, modalShow, hideModal } = this.props;

    return (
      <Modal
        destroyOnClose
        maskClosable={false}
        title="信息"
        visible={modalShow}
        onCancel={() => hideModal()}
        footer={[
          <Button key="close" onClick={() => hideModal()}>
            关闭
          </Button>,
        ]}
      >
        <Card bordered={false}>
          <Card.Meta title={formatMessage({ id: '被加数' })} description={formRecord.a} />
          <br />
          <Card.Meta title={formatMessage({ id: '加数' })} description={formRecord.b} />
          <br />
          <Card.Meta title={formatMessage({ id: '求和' })} description={result} />
        </Card>
      </Modal>
    );
  }
}

export default ModalDemo;
